import React, { useState,useEffect}  from 'react';
import { Tabs } from 'antd';
import { DatePicker, Space } from 'antd';
import moment from "moment";
import "moment/locale/zh-cn";
import index from './index';
import dayjs from 'dayjs';
import localeData from 'dayjs/plugin/localeData'; 


// dayjs.extend(localeData);
const { RangePicker } = DatePicker;

const disabledDate = current => {
  // 禁止选择大于今天的日期
  return current && current > moment().endOf('day');
};

const TimePager = ({ onTimeRangeChange}) => {

  const [selectedTimeRange, setSelectedTimeRange] = useState([]);
  // const todayStart = dayjs();
  // const todayEnd = dayjs();
  // console.log("开始时间：", todayStart, "，结束时间：", todayEnd);

  // const todayStart = moment()
  // .format('YYYY-MM-DD');
  // const todayEnd = moment()
  // .format('YYYY-MM-DD');
  // console.log ("初始值：", todayStart)
  // console.log ("初始值222：", todayEnd)



  // useEffect(() => {
  //   const todayStart = moment().startOf('day').format('YYYY-MM-DD');
  //   const todayEnd = moment().endOf('day').format('YYYY-MM-DD');
  //   setSelectedTimeRange([todayStart, todayEnd]);
  //   onTimeRangeChange(todayStart, todayEnd); // 调用父组件传递的回调函数
  //   console.log ("初始值："+todayStart)
  // }, []);

 const todayStart = moment()
  .format('YYYY-MM-DD');
  const todayEnd = moment()
  .format('YYYY-MM-DD');
  console.log ("初始值：", todayStart)
  console.log ("初始值222：", todayEnd)
  


  const handleRangeChange = (dates, dateStrings) => {

    setSelectedTimeRange(dateStrings);

    onTimeRangeChange(dateStrings[0], dateStrings[1]); // 调用父组件传递的回调函数
  };

  const begin = selectedTimeRange[0];
  const end = selectedTimeRange[1];

  console.log("开始时间：" + begin + "，结束时间：" + end);

  return (
    <Space direction="vertical" size={12}>
      <RangePicker
      defaultValue={[moment(),moment()]}
      onChange={handleRangeChange}
      disabledDate={disabledDate}
      format="YYYY-MM-DD"
       />
      
{/* 
      <p>Selected Start Time: {selectedTimeRange[0]}</p>
      <p>Selected End Time: {selectedTimeRange[1]}</p> */}
    </Space>
  );
};

export default TimePager;